
var panel_index = 0,
	list_index=1,
	indexgl,
	hien_thi = [];

function list(){
	var menu_arrowleft, menu_arrowright, arrowsRight, arrowsLeft, galleryDiv, elem;
menu_arrowleft = document.getElementById("menu_arrowleft");
menu_arrowright = document.getElementById("menu_arrowright");
arrowsRight = document.getElementById("gallery-arrows-right");
arrowsLeft = document.getElementById("gallery-arrows-left");
galleryDiv = document.getElementById("gallery2");
elem = document.getElementById("gallery");
load(list_index);

arrowsRight.addEventListener('click', function() {
	document.getElementById("list_focus").className = "";
	galleryDiv.style.visibility = "visible";
	
	if(indexgl==0){
		alert('gallery2');
		indexgl = 1;
		
		galleryDiv.className = 'show-gallery2';
		elem.className = 'hide-gallery';
		Grid.focus(6);
		
	}
	else if(indexgl==1){
		alert('gallery1');
		indexgl = 0;
		
		elem.className = 'same-show-gallery2';
		galleryDiv.className = 'same-hide-gallery';
		
		Grid.focus(0);
		
    	
	}
	
	alert("indexgl dang la: "+ indexgl);
});

arrowsLeft.addEventListener('click', function() {
	document.getElementById("list_focus").className = "";
	galleryDiv.style.visibility = "visible";
	if(indexgl==1){
		alert('gallery1');
		indexgl = 0;
		
    	elem.className = 'show-gallery';
    	galleryDiv.className = 'hide-gallery2';
    	Grid.focus(0);
    	
	}
	else if(indexgl==0){
		alert('gallery2');
		indexgl = 1;
		
    	galleryDiv.className = 'same-show-gallery';
    	elem.className = 'same-hide-gallery2';
    	Grid.focus(6);
    	
    	
    	
	}
	
	
	alert("indexgl dang la: "+ indexgl);
});


menu_arrowleft.addEventListener('click', function() {
	indexgl=0;
	Grid.setindex(0);
	document.getElementById("menu_arrowleft").className = "arrow-left";
	document.getElementById("gallery2").style.visibility = "hidden";
	if(list_index==1){
		document.getElementById("ds").className = "list1quaphai";
    	alert('list qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==2){
		document.getElementById("ds").className = "list2quaphai";
    	alert('list2 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==3){
		document.getElementById("ds").className = "list3quaphai";
    	alert('list3 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==4){
		document.getElementById("ds").className = "list4quaphai";
    	alert('list4 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==5){
		document.getElementById("ds").className = "list5quaphai";
    	alert('list5 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==6){
		document.getElementById("ds").className = "list6quaphai";
    	alert('list6 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==7){
		document.getElementById("ds").className = "list7quaphai";
    	alert('list7 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==8){
		document.getElementById("ds").className = "list8quaphai";
    	alert('list8 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==9){
		document.getElementById("ds").className = "list9quaphai";
    	alert('list9 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==10){
		document.getElementById("ds").className = "list10quaphai";
    	alert('list10 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==11){
		document.getElementById("ds").className = "list11quaphai";
    	alert('list11 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==12){
		document.getElementById("ds").className = "list12quaphai";
    	alert('list12 qua phai');
    	document.getElementById("menu_arrowleft").className = "arrow-left-click";
	}
	else if(list_index==0){
		list_index++;
	}
	list_index--;
	alert("vi tri: "+ list_index);
	alert("hien tai dang la: "+ indexgl);
	load(list_index);
	
});
menu_arrowright.addEventListener('click', function() {
	indexgl=0;
	Grid.setindex(0);
	document.getElementById("menu_arrowright").className = "arrow-right";
	
	document.getElementById("gallery2").style.visibility = "hidden";
	if(list_index==1){
		document.getElementById("ds").className = "list1quatrai";
    	alert('list qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==0){
		document.getElementById("ds").className = "list0quatrai";
    	alert('list0 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==2){
		document.getElementById("ds").className = "list2quatrai";
    	alert('list2 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==3){
		document.getElementById("ds").className = "list3quatrai";
    	alert('list3 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==4){
		document.getElementById("ds").className = "list4quatrai";
    	alert('list4 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==5){
		document.getElementById("ds").className = "list5quatrai";
    	alert('list5 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==6){
		document.getElementById("ds").className = "list6quatrai";
    	alert('list6 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==7){
		document.getElementById("ds").className = "list7quatrai";
    	alert('list7 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==8){
		document.getElementById("ds").className = "list8quatrai";
    	alert('list8 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==9){
		document.getElementById("ds").className = "list9quatrai";
    	alert('list9 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==10){
		document.getElementById("ds").className = "list10quatrai";
    	alert('list10 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==11){
		document.getElementById("ds").className = "list11quatrai";
    	alert('list11 qua trai');
    	document.getElementById("menu_arrowright").className = "arrow-right-click";
	}
	else if(list_index==12){
		list_index--;
	}
	list_index++;
	
	alert("vi tri: "+ list_index);
	alert("hien tai dang la: "+ indexgl);
	load(list_index);
	
});

}
function load(id){
	var folder = null;
	var domain = null;
	domain = "http://ngoton.com/samsung_app/";
	var ele = document.getElementById("gallery");
	ele.innerHTML = "";
	var ele2 = document.getElementById("gallery2");
	ele2.innerHTML = "";
	
	
	if (window.XMLHttpRequest)
  	  {
  	  xhttp=new XMLHttpRequest();
  	  }
	else
  	  {
  	  xhttp=new ActiveXObject("Microsoft.XMLHTTP");
  	  }
	
	if(id==0){
		xhttp.open("GET",domain+ "data/moncanh.xml",false);
		folder = "moncanh/";
	}
	else if(id==1){
		xhttp.open("GET",domain+ "data/monxao.xml",false);
		folder = "monxao/";
	}
	else if(id==2){
		xhttp.open("GET",domain+ "data/monnuong.xml",false);
		folder = "monnuong/";
	}
	else if(id==3){
		xhttp.open("GET",domain+ "data/monkho.xml",false);
		folder = "monkho/";
	}
	else if(id==4){
		xhttp.open("GET",domain+ "data/monchien.xml",false);
		folder = "monchien/";
	}
	else if(id==5){
		xhttp.open("GET",domain+ "data/monlau.xml",false);
		folder = "monlau/";
	}
	else if(id==6){
		xhttp.open("GET",domain+ "data/monnom.xml",false);
		folder = "monnom/";
	}
	else if(id==7){
		xhttp.open("GET",domain+ "data/monche.xml",false);
		folder = "monche/";
	}
	else if(id==8){
		xhttp.open("GET",domain+ "data/mongoi.xml",false);
		folder = "mongoi/";
	}
	else if(id==9){
		xhttp.open("GET",domain+ "data/monbo.xml",false);
		folder = "monbo/";
	}
	else if(id==10){
		xhttp.open("GET",domain+ "data/monheo.xml",false);
		folder = "monheo/";
	}
	else if(id==11){
		xhttp.open("GET",domain+ "data/monga.xml",false);
		folder = "monga/";
	}
	else if(id==12){
		xhttp.open("GET",domain+ "data/haisan.xml",false);
		folder = "haisan/";
	}
	//..xu li
	
	xhttp.send();
	xmlDoc=xhttp.responseXML;
	x=xmlDoc.getElementsByTagName("monan");
	
	var h = [];
	var k = [];
	var l = [];
	var g = [];
	var z = [];
	for (var j=0;j<x.length;j++)
  	  { 
  	  
  	  h.push(x[j].getElementsByTagName("tenmon")[0].childNodes[0].nodeValue);
  	  k.push(x[j].getElementsByTagName("cachlam")[0].childNodes[0].nodeValue);
  	  l.push(x[j].getElementsByTagName("nguyenlieu")[0].childNodes[0].nodeValue);
  	  g.push(x[j].getElementsByTagName("tenloai")[0].childNodes[0].nodeValue);
  	  z.push(x[j].getElementsByTagName("mota")[0].childNodes[0].nodeValue);
  	  }
	Grid.showinfo(h);
	Grid.showcachlam(k);
	Grid.shownguyenlieu(l);
	Grid.getloaimon(g);
	Grid.showmota(z);
	//..khoi tao
		
	 var soluong = x.length;	
     var images = [];

     for (var i = 1; i < soluong+1; i += 1) {
         images.push(folder + "image_0" + i + ".jpg");
     }

     Grid.getfolder(folder);
     Grid.init("gallery", images);
     Grid.setindex(0);
		
}

function SceneCookingGuide() {
    this.initialize = function () {
        log("SceneCookingGuide.initialize()");
        $('#PopupMang').sfPopup({
			text:'Mất kết nối internet. Bạn muốn thoát ứng dụng?',
			buttons:['Đồng ý ', 'Không'],
			defaultFocus: 1, 
			callback:function(selectedIndex){
				alert('selected button index: ' + selectedIndex);
				if(selectedIndex==0){
					sf.core.exit();
				}
				else{
					sf.scene.hide("CookingGuide");
					sf.scene.show("Main");
			        sf.scene.focus("Main");
				}
			}
		});
        
        	alert('Danh sach loai mon focus');
        	list();
        	
        	$('#PopupThoatCook').sfPopup({
        		text:'Bạn có muốn thoát ứng dụng không?',
        		buttons:['Đồng ý', 'Hủy'],
        		defaultFocus: 1, 
        		callback:function(selectedIndex){
        			alert('selected button index: ' + selectedIndex);
        			if(selectedIndex==0){
        				sf.core.exit();
        			}
        		}
        	});
        // callback will be called when selected image is opened (by remote
        // controller or by clicking/grabbing)
        Grid.callbacks.onPhotoOpened = function() {
            sf.scene.show("Details");
            sf.scene.focus("Details");
        };
    };

    this.handleShow = function () {
        log("SceneCookingGuide.handleShow()");
        
        var helpBarInfo = {
            helpbarType: "HELPBAR_TYPE_GESTURE_CUSTOMIZE",
            itemList: [
                { itemType: "HELPBAR_GESTURE_ITEM_RETURN", itemText: "Go back" },
                { itemType: "HELPBAR_GESTURE_ITEM_POINTING_GESTURE", itemText: "Choose picture" }
            ]
        };

        webapis.recognition.SetGestureHelpbarInfo(JSON.stringify(helpBarInfo));
        
        var helpBarInfo1 = {
                helpbarType: "HELPBAR_TYPE_VOICE_CUSTOMIZE",
                helpbarItemsList: [
                    { itemText: "Up", commandList: [{command: "Up"}] },
                    { itemText: "Down", commandList: [{command: "Down"}] },
                    { itemText: "Left", commandList: [{command: "Left"}]},
                    { itemText: "Right", commandList: [{command: "Right"}]},
                    { itemText: "Open", commandList: [{command: "Open"}]},
                    { itemText: "Close", commandList: [{command: "Close"}]},
                    { itemText: "Exit", commandList: [{command: "Exit"}]}
                ]
            };

            webapis.recognition.SetVoiceHelpbarInfo(JSON.stringify(helpBarInfo1));

        $("#keyhelp").sfKeyHelp({
            "MOVE" : "Di chuyển",
            "ENTER" : "Chọn",
            "RETURN" : "Trở về"
        });
    };

    this.handleHide = function () {
        log("SceneCookingGuide.handleHide()");
    };

    this.handleFocus = function () {
        log("SceneCookingGuide.handleFocus()");
        document.getElementById("keyhelp").style.visibility = "visible";
        GestureDispatcher.currentScene = this;
        VoiceDispatcher.currentScene = this;
        Grid.hienthiketnoi();
    };

    this.handleBlur = function () {
        log("SceneCookingGuide.handleBlur()");
    };

    this.handleKeyDown = function (keyCode) {
        log("SceneCookingGuide.handleKeyDown(" + keyCode + ")");

        switch (keyCode) {
        case sf.key.UP:
        	
        	
        		Grid.up();
        	
            
            break;

        case sf.key.DOWN:
        	
        	
        		Grid.down();
        	
            break;

        case sf.key.LEFT:
        	
        	
        		Grid.left();
        	
            break;

        case sf.key.RIGHT:
        	
        		Grid.right();
        	
            break;
        case sf.key.RED:
        	
    		Grid.helpmenu(0);
    	
        break;
        case sf.key.GREEN:
        	
    		Grid.helpmenu(1);
    	
        break;
        case sf.key.YELLOW:
        	
    		Grid.helpmenu(2);
    	
        break;
        case sf.key.BLUE:
        	
    		Grid.helpmenu(3);
    	
        break;

        case sf.key.RETURN:
        	sf.scene.hide('CookingGuide');
        	sf.scene.show('Main');
			sf.scene.focus('Main');
            break;

        case sf.key.ENTER:
        	
        		Grid.open();
        	
            break;
            
        case sf.key.EXIT:
        	$('#PopupThoatCook').sfPopup('show');
        	
            break;
        }
    };

    this.handleGesture = function(e) {
        log("SceneCookingGuide.handleGesture, type: " + e.eventtype);

        // as for now no gesture events are handled here
        // please look at ScenePhotoView.handleGesture() method
    };
    this.handleVoice = function(e) {
        log("SceneCookingGuide.handleVoicee, type: " + e.eventtype);

        switch (e.result.toLowerCase()) {
            case "up": 
            	
            	
            		Grid.up();
            	
            	break;
            case "down": 
            	
            	
            		Grid.down();
            	 
            	break;
            case "left": 
            	
            	
            	
            	
            		Grid.left();
            	 
            	break;
            case "right": 
            	
            	
            	
            	
            		Grid.right();
            	 
            	break;
            case "open": 
            	
            	            	
            	
            		Grid.open();
            	 
            	break;
            case "close":
                sf.scene.hide("CookingGuide");
                sf.scene.show("Main");
                sf.scene.focus("Main");
                sf.key.preventDefault();
                break;
            case "exit": $('#PopupThoatCook').sfPopup('show'); break;
        }
    };
}
